﻿<!--Copyright © GalaSoft Laurent Bugnion 2010-->

<phone:PhoneApplicationPage x:Class="MultiTouch.Behaviors.WP7.Sample.MainPage"
                            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                            xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
                            xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
                            xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
                            xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
                            xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
                            xmlns:tb="clr-namespace:MultiTouch.Behaviors.WP7;assembly=MultiTouch.Behaviors.WP7"
                            FontFamily="{StaticResource PhoneFontFamilyNormal}"
                            FontSize="{StaticResource PhoneFontSizeNormal}"
                            Foreground="{StaticResource PhoneForegroundBrush}"
                            SupportedOrientations="Portrait"
                            Orientation="Portrait"
                            mc:Ignorable="d"
                            d:DesignWidth="480"
                            d:DesignHeight="768"
                            shell:SystemTray.IsVisible="False"
                            x:Name="MyMainPage">

    <Grid x:Name="LayoutRoot"
          Background="Transparent">
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="SettingsState">
                <VisualStateGroup.Transitions>
                    <VisualTransition GeneratedDuration="0:0:1">
                        <VisualTransition.GeneratedEasingFunction>
                            <ExponentialEase EasingMode="EaseInOut" />
                        </VisualTransition.GeneratedEasingFunction>
                    </VisualTransition>
                </VisualStateGroup.Transitions>
                <VisualState x:Name="SettingsNormal" />
                <VisualState x:Name="SettingsShown">
                    <Storyboard>
                        <DoubleAnimation Duration="0"
                                         To="0"
                                         Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)"
                                         Storyboard.TargetName="SettingsBorder"
                                         d:IsOptimized="True" />
                        <DoubleAnimation Duration="0"
                                         To="1"
                                         Storyboard.TargetProperty="(UIElement.Opacity)"
                                         Storyboard.TargetName="SettingsBorder"
                                         d:IsOptimized="True" />
                        <DoubleAnimation Duration="0"
                                         To="180"
                                         Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.Rotation)"
                                         Storyboard.TargetName="ExpandIcon"
                                         d:IsOptimized="True" />
                    </Storyboard>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>

        <Image Source="/Images/Desert.jpg"
               x:Name="MyImage"
               Width="480">
            <!--Uncomment this to demo the exception thrown. To correct,
                wrap the transformed element in a Border-->
            <!--<Image.RenderTransform>
                <CompositeTransform Rotation="45" />
            </Image.RenderTransform>-->
            
            <i:Interaction.Behaviors>
                <tb:MultiTouchBehavior IsDebugModeActive="True"
                                       AreFingersVisible="True"
                                       IsMockActive="True"                                       
                                       MaximumScale="10"
                                       MinimumScale="0.5"
                                       IsScaleEnabled="True"
                                       IsRotateEnabled="True"
                                       IsTranslateXEnabled="True"
                                       IsTranslateYEnabled="True"/>
            </i:Interaction.Behaviors>
        </Image>
        
        <!--<Rectangle Fill="Yellow"
                   Width="200"
                   Height="300">
            <i:Interaction.Behaviors>
                <tb:MultiTouchBehavior IsDebugModeActive="False"
                                       AreFingersVisible="False"
                                       MaximumScale="10"
                                       MinimumScale="0.5"
                                       IsScaleEnabled="True"
                                       IsTranslateXEnabled="True"
                                       IsTranslateYEnabled="True" />
            </i:Interaction.Behaviors>
        </Rectangle>-->

        <Grid x:Name="SettingsBorder"
              Height="480"
              RenderTransformOrigin="0.5,0.5"
              Opacity="0.5"
              VerticalAlignment="Bottom"
              Background="{StaticResource PhoneBackgroundBrush}"
              Canvas.ZIndex="10000">

            <Grid.RenderTransform>
                <CompositeTransform TranslateY="430" />
            </Grid.RenderTransform>

            <Grid.RowDefinitions>
                <RowDefinition Height="50" />
                <RowDefinition />
            </Grid.RowDefinitions>

            <Rectangle Fill="White"
                       MouseLeftButtonDown="SettingsClick" />

            <StackPanel Orientation="Horizontal"
                        VerticalAlignment="Center"
                        HorizontalAlignment="Center"
                        IsHitTestVisible="False">
                <Image Source="/Resources/settings.png"
                       Margin="0,0,10,0"
                       x:Name="SettingsIcon" />

                <TextBlock Text="Settings..."
                           Foreground="Black"
                           FontSize="32"
                           Margin="0,0,0,5" />

                <Image Source="/Resources/expand.png"
                       Margin="10,0,0,0"
                       RenderTransformOrigin="0.5,0.5"
                       x:Name="ExpandIcon">
                    <Image.RenderTransform>
                        <CompositeTransform />
                    </Image.RenderTransform>
                </Image>
            </StackPanel>

            <StackPanel Margin="20,0"
                        Grid.Row="1">
                <StackPanel Orientation="Horizontal">
                    <CheckBox Content="S"
                              IsChecked="{Binding TouchBehavior.IsScaleEnabled, ElementName=MyMainPage, Mode=TwoWay}" />
                    <CheckBox Content="R"
                              IsChecked="{Binding TouchBehavior.IsRotateEnabled, ElementName=MyMainPage, Mode=TwoWay}" />
                    <CheckBox Content="Tx"
                              IsChecked="{Binding TouchBehavior.IsTranslateXEnabled, ElementName=MyMainPage, Mode=TwoWay}" />
                    <CheckBox Content="Ty"
                              IsChecked="{Binding TouchBehavior.IsTranslateYEnabled, ElementName=MyMainPage, Mode=TwoWay}" />
                </StackPanel>
                <TextBlock Text="Minimum Scale:" />
                <TextBox Text="{Binding TouchBehavior.MinimumScale, ElementName=MyMainPage, Mode=TwoWay}"
                         x:Name="MinimumScaleTextBox" />
                <TextBlock Text="Maximum Scale:" />
                <TextBox Text="{Binding TouchBehavior.MaximumScale, ElementName=MyMainPage, Mode=TwoWay}"
                         x:Name="MaximumScaleTextBox" />

                <StackPanel Orientation="Horizontal"
                            HorizontalAlignment="Center">
                    <Button Content="OK"
                            HorizontalAlignment="Center"
                            Click="OkClick"
                            Width="200"
                            Margin="0,0,20,0" />
                    <Button Content="Reset"
                            HorizontalAlignment="Center"
                            Click="ResetClick"
                            Width="200" />
                </StackPanel>
            </StackPanel>
        </Grid>
    </Grid>

</phone:PhoneApplicationPage>
